<template>
	<view class="myShop">
		<view class="top">
			<view class="item">
				<text>{{info.view}}</text>
				<text>今日访客</text>
			</view>
			<view class="item">
				<text>{{info.order}}</text>
				<text>今日订单数</text>
			</view>
			<view class="item">
				<text>¥{{info.money}}</text>
				<text>今日订单金额</text>
			</view>
		</view>
		<view class="time">
			<view class="left">
				<text>店铺有效期</text>
				<text>{{info.valid_date}}<view v-if="info.is_end == 1" style="color: red;">已过期</view></text>
			</view>
		</view>
		<view class="line rightjt" @click="jump('merchant_detail', info.merchant_id)">
			<text>店铺详情</text>
		</view>
		<view class="line rightjt">
			<button open-type="share">
				<text>分享店铺</text>
			</button>
		</view>
	</view>
</template>

<script>
	import serve from '../../static/request.js';
	import storage from '../../static/appkey.js';
	import common from '../../static/jump.js';
	export default {
		data() {
			return {
				info:{
					merchant_id: 0,
					view: 0,
					order: 0,
					money: 0.00,
					valid_type: 0,
					valid_date: '',
					is_end : 0,
				},
				shareItem: {
					title: '',
					path: '',
					imageUrl: ''
				},
			}
		},
		methods: {
			getInfo() {
				serve.request({
					url: '/marketing/merchant/my-merchant',
					data: {
						appkey: uni.getStorageSync('appkey'),
						'access-token': uni.getStorageSync('access-token'),
					}
				}).then(res => {
					if (res.code == 200) {
						this.info = res.data;
						this.getShareItem();
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
						});
					}
				});
			},
			getShareItem(){
				serve.request({
					url: '/share/index',
					data: {
						appkey: uni.getStorageSync('appkey'),
						'access-token': uni.getStorageSync('access-token'),
						type: 'merchant',
						id: this.info.merchant_id
					}
				}).then(res => {
					this.shareItem.title = res.data.title;
					this.shareItem.path = res.data.path;
					this.shareItem.imageUrl = res.data.imageUrl;
				});
			},
			jump(jump_type, jump_link) {
				common.jump(jump_type, jump_link);
			}
		},
		onLoad() {
			this.getInfo();
		},
		onPullDownRefresh() {
			this.getInfo();
		},
		onShareAppMessage(res) {
			return this.shareItem;
		},
	}
</script>

<style scoped lang="scss">
	.myShop{
		.top{
			display: flex;
			width: 100%;
			justify-content: space-around;
			padding: 62rpx 0rpx;
			border-bottom: 20rpx #F7F7F7 solid;
			.item{
				display: flex;
				flex-direction: column;
				align-items: center;
				text:nth-child(1){
					font-weight:bold;
					color: #444444;
					font-size: 32rpx;
				}
				text:nth-child(2){
					color: #999999;
					font-size: 24rpx;
					margin-top: 25rpx;
				}
			}
		}
		.time{
			display: flex;
			justify-content: space-between;
			align-items: flex-start;
			box-sizing: border-box;
			padding: 46rpx 30rpx;
			border-bottom: 20rpx #F7F7F7 solid;
			.left{
				display: flex;
				flex-direction: column;
				font-size: 28rpx;
				text:last-child{
					color: #999999;
					margin-top: 39rpx;
				}
			}
			.right{
				width:140rpx;
				height:60rpx;
				line-height: 60rpx;
				text-align: center;
				color: #FFFFFF;
				font-size: 28rpx;
				background:rgba(235,89,56,1);
				border-radius:30rpx;
			}
		}
		.rightjt{
			position: relative;
		}
		.line {
			position: relative;
			display: flex;
			box-sizing: border-box;
			padding: 48rpx 33rpx;
			align-items: center;
			font-size: 28rpx;
			border-bottom: 20rpx #F7F7F7 solid;
			color: #666666;
		
			image {
				width:33rpx;
				height:32rpx;
				margin-right: 17rpx;
			}
			.upgrade{			
				color: #EB5938;
				font-size: 28rpx;
				position: absolute;
				right: 50rpx;
			}
			.integral{
				color: #EB5938;
				font-size: 32rpx;
				position: absolute;
				right: 30rpx;
				font-weight: bold;
			}
		}
		.rightjt::after {
			position: absolute;
			right: 33rpx;
			top: 65rpx;
			content: '';
			border: 1rpx solid rgba(57, 72, 107, 0.5);
			border-width: 0 3rpx 3rpx 0;
			padding: 6rpx;
			transform: rotate(-45deg);
			-webkit-transform: rotate(-45deg);
		}
		button {
			margin:0;
			padding: 0;
			line-height: normal;
			background-color: #FFFFFF;
			font-size: 28rpx;
			width: 100%;
			text-align: left;
		}
		
	}
</style>
